// 页面一加载就渲染列表
const tbody = document.querySelector('tbody')
document.addEventListener('DOMContentLoaded', renderList = async() => {
            const res = await axios({
                url: '/score/list'
            })
            const data = res.data.data
            for (let k in data) {
                tbody.innerHTML += `<tr>
              <th scope="row">${k}</th>
          <td>${data[k].name}</td>
          ${data[k].score.map((item,index)=>`<td class="score" data-index='${index+1}' data-id=${k}>${item}</td>`).join('')}
        </tr>`                
    }
})

// 分数编辑功能
tbody.addEventListener('click',e =>{
  const et=e.target
  if(et.className==='score'){           
    let ipt= document.createElement('input')
    ipt.classList.add('inp')
    et.appendChild(ipt)
    ipt.focus()
    ipt.addEventListener('blur',(e)=>e.target.remove())
    ipt.addEventListener('keyup',async (e)=>{

     if(e.key==='Enter'){
       const res= await axios({
        url:'/score/entry',
        method:'post',
        data:{
          stu_id:et.dataset.id,
          batch: et.dataset.index, 
          score: ipt.value
        }              
      })
      console.log(res)
      renderList()
      setTimeout(location.reload(),500)
     }
    })
  }
})